<template>
  <div class="padding: 20px;">
    <a-form :form="form">
      <dynamic-form
        :title="`${PARTONE}`"
        :wrapHeight="360"
        :arr="arr"
      />
    </a-form>
    <a-button style="margin-top: 25px;" type="primary" @click="handleSubmit">
      提交
    </a-button>
    <div style="margin-top: 15px;">{{ param.field }}</div>
  </div>
</template>

<script>
import DynamicForm from './components/DynamicForm.vue'
const PARTONE = 'partOne'

export default {
  name: 'DynamicFormWrap',
  components: { DynamicForm },
  data () {
    return {
      form: this.$form.createForm(this),
      arr: [ // 模拟从接口获取到的数据（如编辑场景）
        { name: '', age:"", gender: '' },
        
      ],
      PARTONE,
      param: {
        field: '' // 模拟接口接收的参数
      }
    }
  },
  methods: {
    // 提交
    handleSubmit () {
      const { form: { validateFields } } = this
      validateFields((errors, values) => {
        if (!errors) {
          const partOneArr = [];
           console.log('提交')
           console.log(values)

          values.partOneName.forEach((item, index) => {
            const obj = {
              name: item,
              age: values.partOneAge[index],
            }
            partOneArr.push(obj)

          })

           console.log(partOneArr)
           console.log('提交')
          // this.param.field = JSON.stringify(partOneArr)

        }


      })


    }
  }
}
</script>

